<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
        <link rel="stylesheet" href="/bundle/bootstrap/toastr/toastr.min.css">
</head>
<body>                            

<button type="button" id="addPic"> <i style="margin-right: 5px;"></i>添加</button>

<div> <script type="text/plain" id="picEdit" ></script></div>
<script src="//cdn.bootcss.com/jquery/1.11.1/jquery.min.js"></script>
    <script type="text/javascript" charset="utf-8" src="ueditor.config.js"></script>
    <script type="text/javascript" charset="utf-8" src="ueditor.all.min.js"> </script>
 <script src="//cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
 <script src="/bundle/bootstrap/toastr/toastr.js"></script>


	<script>
         var picEditor = UE.getEditor( 'picEdit', { 
       	 	isShow: false,
       	 	//serverUrl:'/common/upload/xx',
           	toolbars: [ [ 'insertimage' ] ], 
         } );
         
         picEditor.addListener("ready",function(){
             //this为editor实例
             //this.setContent("欢迎使用UEditor！");
             if( undefined == this.getOpt('imageActionName') ){
                 //alert( '必须先登录才可以上传文件！' );
                 toastr.error('必须先登录才可以上传文件！');
             }
            	 
         })
         
        picEditor.addListener( 'beforeInsertImage', function( t, arg ){     //侦听图片上传
            if( arg.length )
            {
                $( '#pic' ).attr( 'src', arg[0].src );
                $( '#pic' ).siblings( 'input' ).val( arg[0].src );
                $( '#pic' ).show();
            }
        } );
        
        

        
        $( '#addPic' ).click( function(){ //图片的添加
            var myImage = picEditor.getDialog( "insertimage" );
            myImage.open();
        } );
        </script>
</body>
</html>